<template>
  <div>
    <Card title="查看品牌" :bordered="false" dis-hover class="ivu-mt">
      <Form
        ref="brandForm"
        :model="brandFormData"
        :rules="brandFormRules"
        :label-width="140"
      >
        <Row>
          <Col span="18" offset="3">
            <FormItem label="品牌名称：" prop="brandName">
             {{brandFormData.brandName}}
            </FormItem>
            <FormItem label="品牌英文名称：" prop="brandEnName">
              {{brandFormData.brandEnName}}
            </FormItem>
            <FormItem label="厂家品牌影响力是否大于商品品牌：">
              <RadioGroup v-model="brandFormData.factoryInfluenceMore">
                <Radio disabled label="1">是</Radio>
                <Radio disabled label="2">否</Radio>
              </RadioGroup>
            </FormItem>
            <FormItem label="厂家品牌名称：" prop="factoryBrandName">
              {{brandFormData.factoryBrandName}}
            </FormItem>
            <FormItem label="厂家品牌英文名：" prop="factoryBrandEnName">
              {{brandFormData.factoryBrandEnName}}
            </FormItem>
            <!-- 新增字段 -->
            <FormItem label="生产厂家简称：" prop="manufacturerSimpleName">
              {{brandFormData.manufacturerSimpleName}}
            </FormItem>
            <FormItem label="生产厂家全称：" prop="manufacturerName">
              {{brandFormData.manufacturerName}}
            </FormItem>
            <FormItem label="品牌来源：" prop="brandSource">
              <Select disabled v-model="brandFormData.brandSource">
                <Option
                  v-for="(item, index) in brandSourceOptions"
                  :value="item.value"
                  :key="index"
                  >{{ item.label }}
                </Option>
              </Select>
            </FormItem>
            <FormItem label="来源详情：" prop="sourceDetail">
              <Input
                disabled
                v-model="brandFormData.sourceDetail"
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 5 }"
                maxlength="200"
                show-word-limit
              ></Input>
            </FormItem>
            <!-- 新增字段 -->
            <FormItem label="档次定位(内部)：">
              <Select disabled v-model="brandFormData.insideLevel" style="width: 200px">
                <Option
                  v-for="(item, index) in levelMap"
                  :value="item.value"
                  :key="index"
                  >{{ item.label }}
                </Option>
              </Select>
            </FormItem>
            <FormItem label="档次定位(外部)：">
              <Select disabled v-model="brandFormData.outsideLevel" style="width: 200px">
                <Option
                  v-for="(item, index) in levelMap"
                  :value="item.value"
                  :key="index"
                  >{{ item.label }}
                </Option>
              </Select>
            </FormItem>
            <FormItem label="系列：">
              {{brandFormData.series}}
            </FormItem>
            <FormItem label="品牌描述：">
              <Input
                disabled
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 5 }"
                maxlength="200"
                show-word-limit
                v-model="brandFormData.note"
              ></Input>
            </FormItem>
            <!-- 新增字段  -->
            <FormItem label="是否线上展示">
              <RadioGroup v-model="brandFormData.showOnline">
                <Radio disabled :label="1">是</Radio>
                <Radio disabled :label="0">否</Radio>
              </RadioGroup>
            </FormItem>
            <FormItem
              label="商标注册号："
              prop="brandRegisterNo"
            >
              {{brandFormData.brandRegisterNo}}
            </FormItem>
            <!-- 新增字段  -->
            <FormItem
              label="商标注册证："
              prop="imageKey2"
            >
              <Upload
                class="ivu-mr qw-disflex"
                :defaultList="brandImageKey2"
                :mr="16"
                :maxSize="2048"
                :maxLen="1"
                :format="['jpg', 'jpeg', 'png']"
                @handleChangeImage="changeImageKey2"
              >
              </Upload>
            </FormItem>
            <FormItem
              label="品牌logo："
              prop="imageKey1"
            >
              <Upload
                class="ivu-mr qw-disflex"
                :defaultList="brandImageKey1"
                :mr="16"
                :maxSize="2048"
                :maxLen="1"
                :format="['jpg', 'jpeg', 'png']"
                @handleChangeImage="changeImageKey1"
              >
              </Upload>
            </FormItem>
            <FormItem
              label="生产厂家全称logo："
              prop="factoryLogo"
            >
              <Upload
                class="ivu-mr qw-disflex"
                :defaultList="brandImageKey3"
                :mr="16"
                :maxSize="2048"
                :maxLen="1"
                :format="['jpg', 'jpeg', 'png']"
                @handleChangeImage="changeImageKey3"
              >
              </Upload>
            </FormItem>
            <FormItem label="启用状态：">
              <RadioGroup v-model="brandFormData.brandState">
                <Radio disabled label="1">启用</Radio>
                <Radio disabled label="2">禁用</Radio>
              </RadioGroup>
            </FormItem>
            <FormItem label="主品牌：">
              {{brandFormData.parentName}}
            </FormItem>
            <FormItem label="商品名称是否包含品牌：">
              <RadioGroup v-model="brandFormData.productNameType">
                <Radio disabled label="1">包含</Radio>
                <Radio disabled label="2">不包含</Radio>
              </RadioGroup>
            </FormItem>
          </Col>
          <Col span="18" offset="2">
            <FormItem label="原因" v-if="brandFormData.auditState != '2'">
              <Input
                v-model="reason"
                maxlength="100"
                show-word-limit
                type="textarea"
                placeholder="请输入原因"
              />
            </FormItem>
          </Col>
          <Col span="18" offset="3">
            <FormItem>
              <Button type="default" @click="goBack" class="ivu-ml-8"
                >返回</Button
              >
              <template v-if="brandFormData.auditState != '2'">
                <Button
                  :loading="isLoading1"
                  @click="auditSubmit('noPass')"
                  class="ivu-ml-8"
                  >审核不通过</Button
                >
                <Button
                  type="primary"
                  :loading="isLoading"
                  @click="auditSubmit('pass')"
                  class="ivu-ml-8"
                  >审核通过</Button
                >
              </template>
            </FormItem>
          </Col>
        </Row>
      </Form>
    </Card>
  </div>
</template>
<script>
import { ApiRequest } from '@api/basePage';
import brandUpdata from './configjs/brandUpdata';
import Upload from '@/components/common/upload'; // 上传组件
export default {
  components: { Upload },
  mixins: [brandUpdata],
  data () {
    return {
      reason: '',
      allBrandData: [],
      isLoading: false,
      isLoading1: false,
      requestApi: {
        // 视情况自定义
        // 获取编辑页面数据
        getEditPageInfo: {
          url: '/sysback/productbrand/productbrandaudit/baseGetByUuid', // 接口地址
          type: 'post' // 接口请求类型
        },
        // 审核通过
        auditPass: {
          url: '/sysback/productbrand/productbrandaudit/auditPass', // 接口地址
          type: 'post' // 接口请求类型
        },
        // 审核不通过
        auditNoPass: {
          url: '/sysback/productbrand/productbrandaudit/auditNoPass', // 接口地址
          type: 'post' // 接口请求类型
        },
        // 获取所有品牌
        getAllProductBrands: {
          url: '/sysback/productbrand/productbrand/getAllProductBrands', // 接口地址
          type: 'post' // 接口请求类型
        }
      },
      levelMap: [
        {
          value: '1',
          label: '高'
        },
        {
          value: '2',
          label: '中高'
        },
        {
          value: '3',
          label: '中'
        },
        {
          value: '4',
          label: '中低'
        },
        {
          value: '5',
          label: '低'
        }
      ]
    };
  },
  created () {
    // this.getAllProductBrands();
    this.getBrandInfo();
  },
  methods: {
    // 开始请求所有品牌信息
    getAllProductBrands () {
      // this.isLoading = true;
      ApiRequest(
        this.requestApi.getAllProductBrands.url,
        this.requestApi.getAllProductBrands.type,
        {},
        false
      ).then((res) => {
        if (res.retStatus === '1') {
          this.allBrandData = res.retData ? res.retData : [];
        }
        // this.isLoading = false;
      });
    },
    // 返回
    goBack () {
      this.$router.go(-1);
    },
    // 提交审核
    auditSubmit (type) {
      let requestUrl = '';
      if (type == 'pass') {
        // 审核通过
        requestUrl =
          this.requestApi.auditPass.url +
          '?uuids=' +
          this.uuid +
          '&auditNote=' +
          this.reason;
        this.isLoading = true;
      }
      if (type == 'noPass') {
        // 审核不通过
        if (this.reason === '') {
          this.$Message.info('审核原因不能为空!');
          return;
        }
        requestUrl =
          this.requestApi.auditNoPass.url +
          '?uuids=' +
          this.uuid +
          '&auditNote=' +
          this.reason;
        this.isLoading1 = true;
      }
      ApiRequest(requestUrl, 'post', { uuid: this.uuid }, false).then((res) => {
        if (res.retStatus === '1') {
          this.$Message.success('操作成功');
          this.$router.go(-1);
        }
        this.isLoading = false;
        this.isLoading1 = false;
      });
    },
    getBrandInfo () {
      this.isLoading = true;
      let data = {
        uuid: this.uuid
      };
      ApiRequest(
        this.requestApi.getEditPageInfo.url,
        this.requestApi.getEditPageInfo.type,
        data,
        true
      ).then((res) => {
        if (res.retStatus === '1') {
          if (res.retData !== '') {
            let rData = res.retData;
            this.brandFormData = {
              ...this.brandFormData,
              ...rData
            };
            this.resetBrandFormData = JSON.parse(
              JSON.stringify(this.brandFormData)
            );
            if (rData.imageKey1 && rData.imageKey1 !== '') {
              this.brandImageKey1.push({
                url: '/' + rData.imageKey1,
                name: '' // 图片/视频名称
              });
            }
            if (rData.imageKey2 && rData.imageKey2 !== '') {
              this.brandImageKey2.push({
                url: '/' + rData.imageKey2,
                name: '' // 图片/视频名称
              });
            }
            if (rData.factoryLogo && rData.factoryLogo !== '') {
              this.brandImageKey3.push({
                url: '/' + rData.factoryLogo,
                name: '' // 图片/视频名称
              });
            }
          }
        }
        this.isLoading = false;
      });
    }
  }
};
</script>
<style lang="less" scoped>
.qw-disflex /deep/.ivu-icon-ios-trash-outline {
  display: none;
}

.qw-disflex /deep/.ivu-icon-ios-eye-outline {
  margin-right: 2px !important;
}
</style>
